<template>
  <transition>
  <div class="report-order-details platform-report-details">
    <section class="app-main">
      <mt-swipe :auto="4000" class="pic-car" v-if="picCar.length>0">
        <mt-swipe-item v-for="item in picCar">
          <img :src="item.src" @click="handleCheckPic('0')">
        </mt-swipe-item>
      </mt-swipe>
      <div class="module-height"></div>
      <dl class="module-block" v-if="res.cancelApplyReason">
        <dt class="block-header block-header-no-before"><span class="iconfont icon-jingshi"></span>取消原因</dt>
        <dd class="word-content word-info" v-html="res.cancelApplyReason"></dd>
      </dl>
      <dl class="module-block" v-if="res.feedBackMessage">
        <dt class="block-header">门店管理员反馈消息</dt>
        <dd class="word-content word-info" v-html="res.feedBackMessage"></dd>
      </dl>
      <dl class="module-block" v-if="res.demandSource!==1">
        <dt class="block-header">服务内容</dt>
        <dd class="word-content word-info" v-html="res.remark"></dd>
      </dl>
      <dl class="module-block" v-if="res.confirmComments || res.incomplete">
        <dt class="block-header">施工反馈</dt>
        <dd class="word-content word-info"><span v-if="res.incomplete==1">无法完工-</span>{{res.confirmComments}}</dd>
      </dl>
      <dl class="module-block module-block-first" v-if="res.demandSource==1">
        <dt class="block-header">工单说明</dt>
        <dd class="word-content word-info" v-html="res.comments"></dd>
      </dl>
      <!--<dl class="module-block">-->
        <!--<dt class="block-header" style="height: 42px;line-height: 32px;">维修部位</dt>-->
        <!--<dd class="word-content" v-for="item in res.parts" v-if="item.partType!=='3'">{{item.remark}}<template v-if="res.demandSource==1">({{item.partTypeDesc}})-<span class="text-red">￥{{item.amount}}</span></template></dd>-->
      <!--</dl>-->
      <!--第三方报单-->
      <dl class="module-block" v-if="res.demandSource==1">
        <dt class="block-header">订单信息<span class="item-state text-red" v-text="res.allotStatusDesc"></span></dt>
        <dd class="word-content">服务门店：<span v-text="res.allotShopName"></span></dd>
        <dd class="word-content">服务人员：<span v-for="item in allotPeople">{{item.name}}&nbsp;&nbsp;</span></dd>
        <dd class="word-content">报单单位：<span v-text="res.applyShopName"></span></dd>
        <dd class="word-content">联&nbsp;系&nbsp;人：<span v-text="res.linkMan"></span></dd>
        <dd class="word-content">联系电话：<span v-text="res.linkPhone"></span></dd>
        <dd class="word-content">联系地址：<span v-text="res.address"></span></dd>
        <dd class="word-content">车牌号：<span v-text="res.carNo"></span></dd>
        <dd class="word-content">自编号：<span v-text="res.selfNumber"></span></dd>
        <dd class="word-content">车&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;型：<span v-text="res.carModel"></span></dd>
        <dd class="word-content">订&nbsp;单&nbsp;号：<span v-text="res.sn"></span></dd>
        <dd class="word-content">维修图片：<span @click="handleCheckPic('1')" class="text-red">点击查看（{{picRepair.length}}张）</span></dd>
      </dl>
      <!--第三方报单-->

      <!--保险报单-->
      <dl class="module-block" v-if="res.demandSource==3">
        <dt class="block-header">订单信息<span class="item-state text-red" v-text="res.allotStatusDesc"></span></dt>
        <dd class="word-content">服务门店：<span v-text="res.allotShopName"></span></dd>
        <dd class="word-content">服务人员：<span v-for="item in allotPeople">{{item.name}}&nbsp;&nbsp;</span></dd>
        <dd class="word-content">客户类型：<span v-text="res.applyCustomTypeName"></span></dd>
        <dd class="word-content">客户名称：<span v-text="res.applyCustomName"></span><span><template v-if="res.applyCustomDesc">({{res.applyCustomDesc}})</template></span></dd>
        <dd class="word-content">报&nbsp; 案&nbsp; 号：<span v-text="res.insureNumber"></span></dd>
        <dd class="word-content">客户姓名：<span v-text="res.linkMan"></span></dd>
        <dd class="word-content">联系电话：<span v-text="res.linkPhone"></span></dd>
        <dd class="word-content">车&nbsp;牌&nbsp;号：<span v-text="res.carNo"></span></dd>
        <dd class="word-content">自&nbsp;编&nbsp;号：<span v-text="res.selfNumber"></span></dd>
        <dd class="word-content">车&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;型：<span v-text="res.carModel"></span></dd>
        <dd class="word-content">作业地点：
          <span class="word-content-address" v-if="res.xAxis" @click="handleNavigation">
            {{res.address}}
            <span class="iconfont icon-didian1"></span>
          </span>
          <span class="word-content-address" v-else>{{res.address}}</span>
        </dd>
        <dd class="word-content">报案时间：<span v-text="res.insureDateStr"></span></dd>
        <dd class="word-content">订&nbsp;单&nbsp;号：<span v-text="res.sn"></span></dd>
        <dd class="word-content">是否补录：<span v-if="res.entryFinish==true">是</span><span v-if="res.entryFinish==false">否</span>
        <dd class="word-content">维修图片：<span @click="handleCheckPic('1')" class="text-red">点击查看（{{picRepair.length}}张）</span></dd>
      </dl>
      <!--保险报单-->
      <!--合约客户，散户报单-->
      <dl class="module-block" v-if="res.demandSource==4 || res.demandSource==5">
        <dt class="block-header">订单信息<span class="item-state text-red" v-text="res.allotStatusDesc"></span></dt>
        <dd class="word-content">服务门店：<span v-text="res.allotShopName"></span></dd>
        <dd class="word-content">服务人员：<span v-for="item in allotPeople">{{item.name}}&nbsp;&nbsp;</span></dd>
        <dd class="word-content">客户类型：<span v-text="res.applyCustomTypeName"></span></dd>
        <dd class="word-content">客户名称：<span v-text="res.applyCustomName"></span><span><template v-if="res.applyCustomDesc">({{res.applyCustomDesc}})</template></span></dd>
        <dd class="word-content">车&nbsp;牌&nbsp;号：<span v-text="res.carNo"></span></dd>
        <dd class="word-content">自&nbsp;编&nbsp;号：<span v-text="res.selfNumber"></span></dd>
        <dd class="word-content">车&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;型：<span v-text="res.carModel"></span></dd>
        <dd class="word-content">作业地点：
          <span class="word-content-address" v-if="res.xAxis" @click="handleNavigation">
            {{res.address}}
            <span class="iconfont icon-didian1"></span>
          </span>
          <span class="word-content-address" v-else>{{res.address}}</span>
        </dd>
        <dd class="word-content">订&nbsp;单&nbsp;号：<span v-text="res.sn"></span></dd>
        <dd class="word-content">是否补录：<span v-if="res.entryFinish==true">是</span><span v-if="res.entryFinish==false">否</span>
        <dd class="word-content">维修图片：<span @click="handleCheckPic('1')" class="text-red">点击查看（{{picRepair.length}}张）</span></dd>
      </dl>
      <!--合约客户，散户报单-->
      <dl class="module-block" v-if="typeof res.secondAllotReasonType!=='undefined'">
        <dt class="block-header">暂不派工原因</dt>
        <dd class="word-content word-info">
          <template v-if="res.secondAllotReasonType==0">等待统一调度</template><template v-if="res.secondAllotReasonType==1">客户原因取消</template>-{{res.secondAllotReason}}</dd>
      </dl>
      <dl class="module-block module-block-price" v-if="res.demandSource!=1">
        <dt class="block-header">报价明细</dt>
        <dd class="word-content" v-for="item in res.parts">{{item.remark}}<template v-if="item.partTypeDesc">({{item.partTypeDesc}})</template>：
          <span class="text-red text-price">￥{{item.amount}}</span>
        </dd>
        <dd class="word-content">合&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;计：<span class="text-red text-price">￥{{res.totalAmt}}</span></dd>
      </dl>
      <dl class="module-block module-block-price" v-else>
        <dt class="block-header">报价明细</dt>
        <dd class="word-content" v-for="item in res.parts" v-if="item.isChoose==1">{{item.remark}}<template v-if="item.partTypeDesc">({{item.partTypeDesc}})</template>：<span class="text-red text-price">￥{{item.amount}}</span></dd>

        <dd class="word-content">合&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;计：<span class="text-red text-price">￥{{res.totalAmt}}</span></dd>
      </dl>
      <dl class="module-block module-action-log">
        <dt class="block-header">工单操作记录</dt>
        <div class="word-content word-info">
          <table class="module-table">
            <tr class="action-list action-list-header">
              <td class="action-item" width="12%">序号</td>
              <td class="action-item" width="20%">操作员</td>
              <td class="action-item" width="20%">操作</td>
              <td class="action-item" width="48%">对象及操作时间</td>
            </tr>
            </table>
          <div class="word-auto">
            <table class="module-table">
            <tr class="action-list" v-for="(item,index) in res.historys">
              <td class="action-item" width="12%">{{res.historys.length-index}}</td>
              <td class="action-item" width="20%">{{item.operatorName}}</td>
              <td class="action-item" width="20%" v-if="item.type==0">新建</td>
              <td class="action-item" width="20%" v-if="item.type==1">建档</td>
              <td class="action-item" width="20%" v-if="item.type==2">派工</td>
              <td class="action-item" width="20%" v-if="item.type=='2-1'">分派</td>
              <td class="action-item" width="20%" v-if="item.type=='5-1'">确认并支付</td>
              <td class="action-item" width="20%" v-if="item.type==3">完成</td>
              <td class="action-item" width="20%" v-if="item.type=='3-1'">汽修厂完成</td>
              <td class="action-item" width="20%" v-if="item.type==4">报价</td>
              <td class="action-item" width="20%" v-if="item.type==5">确认报价</td>
              <td class="action-item" width="20%" v-if="item.type==6">撤回派单</td>
              <td class="action-item" width="20%" v-if="item.type==7">接单</td>
              <td class="action-item" width="20%" v-if="item.type=='7-1'">拒绝接单</td>
              <td class="action-item" width="20%" v-if="item.type==8">拍照上传</td>
              <td class="action-item" width="20%" v-if="item.type==9">支付完成</td>
              <td class="action-item" width="20%" v-if="item.type==10">取消工单</td>
              <td class="action-item" width="20%" v-if="item.type==11">申请取消</td>
              <td class="action-item" width="20%" v-if="item.type=='11-1'">取消待派</td>
              <td class="action-item" width="20%" v-if="item.type=='11-2'">驳回取消申请</td>
              <td class="action-item" width="20%" v-if="item.type=='13'">反馈消息</td>
              <td class="action-item" width="20%" v-if="item.type=='13-1'">门店管理员反馈消息</td>
              <td class="action-item" width="48%"><div>{{item.remark}}</div>{{item.createDateStr}}</td>
            </tr>
            </table>
          </div>
        </div>
      </dl>
      <template v-if="res.storeAllotStatus!=7">
        <div class="button-content" v-if="res.allotStatus!==6">
          <div class="button-block-6" v-if="res.demandType!=2">
            <mt-button type="primary" @click="handleModify('typePrice')">报价</mt-button>
          </div>
          <div class="button-block-6" v-if="res.demandType!=2">
            <mt-button type="primary" @click="handleModify('typeModify')">建档</mt-button>
          </div>
          <div class="button-block-12" v-if="res.demandType==2">
            <mt-button type="primary" @click="handleModify('typeModify')">建档</mt-button>
          </div>
          <div class="button-block-12" v-if="res.allotStatus!==2 && res.allotStatus!==4" style="padding:16px 0 0">
            <mt-button type="danger" v-if="res.allotStatus==0" @click="handleModify('typeSend')">派工</mt-button>
            <mt-button type="danger" v-if="res.allotStatus!==0" @click="handleModify('typeSend')">改派</mt-button>
          </div>
          <div class="button-block-12" v-if="res.allotStatus==2" style="padding:16px 0 0">
          <mt-button type="danger" @click="handleRecall">强制撤回</mt-button>
          </div>
          <div class="del-button" v-if="res.allotStatus!==2 && res.allotStatus!==4">
          <span class="iconfont icon-shanchu" @click="handleCancelOrder"></span></div>
        </div>
        <div class="button-content" v-if="res.allotStatus==6">
          <div class="button-block-12">
            <mt-button type="primary" @click="handleModify('typeModify')">建档</mt-button>
          </div>
        </div>
      </template>

      <template v-if="res.storeAllotStatus==7">
        <div class="button-content">
          <div class="button-block-6">
            <mt-button type="danger" @click="handleSureApplyCancle">通过申请</mt-button>
          </div>
          <div class="button-block-6">
            <mt-button type="primary" @click="handleNoApplyCancle">驳回申请</mt-button>
          </div>
          </div>
      </template>
      <!--派工弹窗-->
      <mt-popup
        v-model="popupSend"
        position="bottom" class="popupResult">
        <mt-cell class="item-select" title="服务门店" :value="form.allotShopName" is-link @click.native="handleSelectApply('apply')"></mt-cell>
        <dl class="people-list" v-if="res.allotStatus!==0 || showPeople==true">
          <dd class="people-item" v-if="optionsPeopleNameZ.length>0">
            <div class="item-title">管理员
            </div>
            <mt-checklist
              class="select-people-name"
              title=""
              v-model="selectPeopleNameZ"
              :options="optionsPeopleNameZ">
            </mt-checklist>
          </dd>
        </dl>

        <div class="button-content">
          <div class="button-block-6">
            <mt-button type="danger" @click="handleSendConfirm">确定</mt-button>
          </div>
          <div class="button-block-6">
            <mt-button type="default" @click="handleCancel">取消</mt-button>
          </div>
        </div>
      </mt-popup>
      <!--派工弹窗-->
      <!--建档弹窗-->
      <mt-popup
        v-model="popupModify"
        position="bottom"
        class="popupResult">
        <template v-if="res.demandSource==1">
          <mt-field label="工单说明" class="info-service info-service-qixiu" type="textarea" v-model="form.comments" oninput="this.style.height=this.scrollHeight + 'px'"></mt-field>
          <mt-field label="联系人" placeholder="" v-model="form.linkMan"></mt-field>
          <mt-field label="联系电话" placeholder="" v-model="form.linkPhone"></mt-field>
          <mt-field label="车牌号" placeholder="" v-model="form.carNo"></mt-field>
          <mt-field label="自编号" placeholder="" v-model="form.selfNumber"></mt-field>
          <mt-field label="车型" placeholder="" v-model="form.carModel"></mt-field>
          <mt-field label="作业地点" placeholder="" v-model="form.address"><span class="iconfont icon-didian1" @click="handleSelectAddress"></span></mt-field>
        </template>
        <template v-if="res.demandSource==3">
          <mt-field label="服务内容" class="info-service" type="textarea" v-model="form.remark" oninput="this.style.height=this.scrollHeight + 'px'"></mt-field>
          <div class="module-recognition">
            <mt-button class="action-recognition" type="danger" @click="handleRecognition">自动识别</mt-button>
          </div>

          <!--<mt-cell class="item-select" title="客户类别" :value="form.applyShopName" is-link @click.native="handleSelectApply('allotFirst')"></mt-cell>-->
          <mt-field label="报案号" placeholder="" v-model="form.insureNumber"></mt-field>
          <mt-field label="客户姓名" placeholder="" v-model="form.linkMan"></mt-field>
          <mt-field label="联系电话" placeholder="" v-model="form.linkPhone"></mt-field>
          <mt-field label="报案时间" placeholder="" v-model="form.insureDateStr"></mt-field>
          <mt-field label="车牌号" placeholder="" v-model="form.carNo"></mt-field>
          <mt-field label="自编号" placeholder="" v-model="form.selfNumber"></mt-field>
          <mt-field label="车型" placeholder="" v-model="form.carModel"></mt-field>
          <mt-field label="作业地点" placeholder="" v-model="form.address"><span class="iconfont icon-didian1" @click="handleSelectAddress"></span></mt-field>
          <div class="module-position">
            <span class="label-title">维修部位</span>
            <ul class="position-list">
              <li class="position-item" v-for="item in form.checkoptions">
                <input class="check-position" type="checkbox" v-model="item.isCheck" :id="item.id"><label :for="item.id" class="">{{item.label}}</label>
                <dl class="type-item-details" v-if="item.label=='侧窗'">
                  <dd class="item-block">
                    左侧第<input type="number" v-model="item.side[0].number" class="input-text">片，
                  </dd>
                  <dd class="item-block">
                    右侧第<input type="number" v-model="item.side[1].number" class="input-text">片
                  </dd>
                </dl>
              </li>

            </ul>
          </div>
        </template>

        <template v-if="res.demandSource==4 || res.demandSource==5">
          <mt-field label="服务内容" class="info-service" type="textarea" v-model="form.remark" oninput="this.style.height=this.scrollHeight + 'px'"></mt-field>

          <div class="module-recognition">
            <mt-button class="action-recognition" type="danger" @click="handleRecognition">自动识别</mt-button>
          </div>
          <!--<mt-cell class="item-select" title="客户类型" :value="form.applyCustomTypeName" is-link @click.native="handleSelectApply('allotSecond')"></mt-cell>-->
          <!--<mt-field label="客户名称" placeholder="" v-model="form.applyShopName"></mt-field>-->
          <mt-field label="车牌号" placeholder="" v-model="form.carNo"></mt-field>
          <mt-field label="自编号" placeholder="" v-model="form.selfNumber"></mt-field>
          <mt-field label="车型" placeholder="" v-model="form.carModel"></mt-field>
          <mt-field label="作业地点" placeholder="" v-model="form.address"><span class="iconfont icon-didian1" @click="handleSelectAddress"></span></mt-field>
          <div class="module-position">
            <span class="label-title">维修部位</span>
            <ul class="position-list">
              <li class="position-item" v-for="item in form.checkoptions">
                <input class="check-position" type="checkbox" v-model="item.isCheck" :id="item.id"><label :for="item.id" class="">{{item.label}}</label>
                <dl class="type-item-details" v-if="item.label=='侧窗'">
                  <dd class="item-block">
                    左侧第<input type="number" v-model="item.side[0].number" class="input-text">片，
                  </dd>
                  <dd class="item-block">
                    右侧第<input type="number" v-model="item.side[1].number" class="input-text">片
                  </dd>
                </dl>
              </li>

            </ul>
          </div>
        </template>
        <div class="button-content">
          <div class="button-block-6">
            <mt-button type="danger" @click="handleConfirm">确定</mt-button>
          </div>
          <div class="button-block-6">
            <mt-button type="default" @click="popupModify=false">取消</mt-button>
          </div>
        </div>
      </mt-popup>
      <!--建档弹窗-->

      <!--报价弹窗-->
      <mt-popup
        v-model="popupPriceModify"
        position="bottom"
        class="popup-price">
        <template>
          <div class="add-button" v-if="res.finishOffer==false">
            <mt-button type="primary" @click="handleAddPrice('')"><span class="iconfont icon-zengjia"></span>配件项目</mt-button>
            <mt-button type="danger" @click="handleAddPrice('3')"><span class="iconfont icon-zengjia"></span>服务项目</mt-button>
          </div>
          <dl class="price-list">
            <dt class="price-header">
              <span class="item-addon">配件项目</span>
              <span class="item-content">价格</span>
            </dt>
            <dd class="price-item" v-for="(item,index) in form.parts" v-if="item.fromCustomer">
              <mt-field class="item-addon" v-model="item.remark"></mt-field>
              <mt-field class="item-content" type="number" v-model.number="item.amount" :disabled="res.finishOffer"></mt-field>
            </dd>
            <dd class="price-item" v-for="(item,index) in form.parts" v-if="item.fromCustomer==false && item.partType!='3'">
              <mt-field class="item-addon" v-model="item.remark" :disabled="res.finishOffer"></mt-field>
              <mt-field class="item-content" type="number" v-model.number="item.amount" :disabled="res.finishOffer"></mt-field>
              <span v-if="res.finishOffer==false" class="iconfont icon-delete" @click="handleDelPrice(item,index)"></span>
            </dd>
          </dl>
          <dl class="price-list" v-if="servicePriceAttr.length>0">
            <dt class="price-header">
              <span class="item-addon" style="width: 60%;">服务项目</span>
              <span class="item-content">价格</span>
            </dt>
            <dd class="price-item" v-for="(item,index) in form.parts" v-if="item.fromCustomer==false && item.partType=='3'">
              <mt-field class="item-addon" style="width: 60%;" v-model="item.remark" :disabled="res.finishOffer"></mt-field>
              <mt-field class="item-content" type="number" v-model.number="item.amount" :disabled="res.finishOffer"></mt-field>
              <span v-if="res.finishOffer==false" class="iconfont icon-delete" @click="handleDelPrice(item,index)"></span>
            </dd>
          </dl>
          <mt-field class="price-num" label="总价" placeholder="" v-model="form.totalAmt" :disabled="res.finishOffer"></mt-field>
          <!--<mt-field v-for="item in form.parts" :label="item.remark+'('+item.brand+')'" placeholder="" v-model.number="item.amount" :disabled="res.finishOffer"></mt-field>-->
          <div class="module-sure-price">
            <span class="addon">最终确认报价</span>
            <mt-radio
              title=""
              class="select-sure-price"
              v-model="offerStatus"
              :options="optionsSurePrice">
            </mt-radio>
            <div class="price-tips" v-if="res.finishOffer==false">谨慎操作，确认报价后，价格不可修改！</div>
          </div>
        </template>

        <div class="module-sure-price">
          <span class="addon">是否需要付款</span>
          <mt-radio
            title=""
            class="select-sure-price"
            v-model="form.needPay"
            :options="optionsNeedPay">
          </mt-radio>
        </div>

        <div class="sure-price-tips" v-if="res.finishOffer">您已确认最终报价，不可再次修改！</div>
        <div class="button-content" style="padding-top:40px;">
          <div class="button-block-6">
            <mt-button type="primary" @click="handleClosePrice">取消</mt-button>
          </div>
          <div class="button-block-6">
            <mt-button type="danger" @click="handleConfirmPrice">确定</mt-button>
          </div>
        </div>
      </mt-popup>
      <!--报价弹窗-->

      <mt-popup
        v-model="popupSwiper"
        position="middle" class="me-popup me-popup-pic" @click.native="popupSwiper=false">
        <!--<span class="iconfont icon-close2 icon-close-pic" @click="popupSwiper=false"></span>-->
        <mt-swipe class="swiper-pic" :auto="4000" v-if="picList.length>0">
          <mt-swipe-item v-for="(item,index) in picList">
            <div class="item-content">
              <img class="img" :src="item.src"/>
            </div>
            <span class="item-title">{{index+1}}/{{picList.length}}　{{item.fileLocate}}</span>
          </mt-swipe-item>
        </mt-swipe>
        <div class="pic-none" v-if="picList.length<=0">
          暂无图片信息
        </div>
      </mt-popup>
      <!--滑动选择派工人员弹窗-->
      <mt-popup
        v-model="popupShow"
        position="bottom" class="me-popup">
        <!--{{form}}-->
        <mt-picker :slots="slots" @change="onValuesChange" class="picker-bottom picker-store"></mt-picker>
        <div class="button-content">
          <mt-button type="danger" @click="popupShow=false">确认</mt-button>
        </div>
      </mt-popup>
      <!--滑动选择派工人员弹窗-->
      <!--地图弹窗-->
      <mt-popup
        v-model="popupMap"
        position="right" class="popup-map">
        <map-select @mapData="getMapData" @mapClose="handleMapClose"></map-select>
      </mt-popup>
      <!--地图弹窗-->

    </section>
  </div>
    </transition>
</template>

<script>
  import { Navbar,Button,MessageBox,Toast ,Checklist,Popup,Picker,Swipe, SwipeItem} from 'mint-ui';
  import mapSelect from '../common/map-select';
export default {
  components:{
    mapSelect
  },
  data () {
    return {
      offerStatus:'0',
      optionsSurePrice:[
        {
          label:'是',
          value:'1',
        },{
          label:'否',
          value:'0',
        }
      ],
      optionsNeedPay:[
        {
          label:'是',
          value:'1',
        },{
          label:'否',
          value:'0',
        }
      ],

      res:'',
      servicePriceAttr:[],
      allotPeople:[],
      dealStoreList:[],
      popupModify:false,
      popupPriceModify:false,
      popupShow:false,
      popupSwiper:false,
      popupSend:false,
      slots:[],
      picList:[],
      picCar:[],
      picRepair:[],
      storeAllMen:[],
      showPeople:false,
      selectPeopleNameZ:[],
      optionsPeopleNameZ:[],
      applysSlots: [
        {
          flex: 1,
          values: [],
          className: 'slot1',
          textAlign: 'center'
        },
      ],
      allotsSlots: [
        {
          flex: 1,
          values: ['中国人保', '平安财险', '鼎和财险'],
          className: 'slot1',
          textAlign: 'center'
        },
      ],
      files:[],
      form:{
        allotShopName:'请选择服务门店',
        parts:[],
      },
      popupMap:false,
      userlocation: {lng: "", lat: ""},
      isSelectMap:false,
    }
  },
  beforeRouteEnter (to, from, next) {
    var u = navigator.userAgent;
    var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
    // XXX: 修复iOS版微信HTML5 History兼容性问题
    if (isiOS && to.path !== location.pathname) {
      // 此处不可使用location.replace
      location.assign(to.fullPath)
    } else {
      next()
    }
  },
  created(){
//    this.getData();
//    this.getStoreData();

    //  调取微信配置接口
//    this.url=location.href;
//    var params = new URLSearchParams();
//    params.append('url',this.url);
//    this.$axios({
//      method: 'post',
//      url:'gp/cardCancel/getCardCancel',
//      data:params
//    }).then((res)=> {
//      this.wxConfig=res.data;
//    this.$wx.config({
//      beta: true,// 必须这么写，否则wx.invoke调用形式的jsapi会有问题
//      debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
//      appId: 'ww523544f7e1e50c46', // 必填，企业微信的corpID
//      timestamp:this.wxConfig.timestamp, // 必填，生成签名的时间戳
//      nonceStr: this.wxConfig.nonceStr, // 必填，生成签名的随机串
//      signature: this.wxConfig.signature,// 必填，签名，见附录1
//      jsApiList: ['openLocation'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
//    });
//  });
  },
  computed:{
    getNum: function(){

      console.log(this.form.totalAmt,1111)
        if(this.form.parts.length>0){
          var sum =0;
          for(var i= 0 ;i< this.form.parts.length; i++) {
            console.log(this.form.parts[i].amount,222)
            if(this.form.parts[i].amount!=undefined){
              sum += this.form.parts[i].amount;
            }
          }
          return sum;
        }
    }
  },
  watch:{
    'form.uploads'(val){
      for(var i=0;i<val.length;i++){
        if(val[i].fileType==0){
          this.$set(this.files[i], 'tag', val[i].etag)
        }
      }
    },
    'getNum'(val){
      this.form.totalAmt=parseFloat(val.toFixed(2));
    },
    'selectPeopleNameZ'(val){
      this.form.allotsSave=[];
      for(var i=0;i<val.length;i++){
        for(var j=0;j<this.storeAllMen.length;j++){
          if(val[i]==this.storeAllMen[j].id){
            const item={
              allotShopId:this.form.allotShopId,
              allotMemberId:val[i],
              allotOpenId:this.storeAllMen[j].userId,
              allotMemberName:this.storeAllMen[j].name,
              memberType:this.storeAllMen[j].shopKeeper,
            }
            this.form.allotsSave.push(item)
          }
        }
      }
    },
  },
  methods:{

    /**获取oss配置**/
    getOss(){
      let OSS = require('ali-oss');
      this.client = new OSS({
        region: "oss-cn-shenzhen",
        secure: true,//https
        endpoint: 'oss-cn-shenzhen.aliyuncs.com',
        accessKeyId: "LTAIPCNdQvX5yOwc",
        accessKeySecret: "7bReGAz8bc9aJdK4IAz5KW5fnNOzrQ ",
        bucket: 'rmcbapp'
      });
    },

    /** 获取门店列表 **/
    getStoreData() {
      var params = new URLSearchParams();
      params.append('page',1);
      params.append('pageRow',1000);
      this.$axios({
        method: 'post',
        url:'gp/dataStatics/getStoreList',
        data:params
      }).then((res)=>{
      this.dealStoreList = res.data.object.rows;
      for(var i=0;i<res.data.object.rows.length;i++){
        if(res.data.object.rows[i].storeType==1){
          this.applysSlots[0].values.push(res.data.object.rows[i].storeName);
        }
      }
    })
    },
    /** 获取工单详情信息 **/
    getData(){

      this.servicePriceAttr=[];
      var params = new URLSearchParams();
      params.append('demandId',this.$route.query.id);
      this.$axios({
        method: 'post',
        url:'gp/declaration/demandDetails',
        data:params
      }).then((res)=>{
        if(res.data.statusCode==200){
        console.log(res)
        this.allotPeople=[];
        this.res=res.data.object;
        this.form.uploads=this.res.uploads
        for(var i=0;i<this.form.uploads.length;i++){
          const item = {
            name: this.form.uploads[i].sourceFileName,
            tag : this.form.uploads[i].etag,
            fileLocate:this.form.uploads[i].fileLocate,
            src: 'https://rmcbapp.oss-cn-shenzhen.aliyuncs.com/'+this.form.uploads[i].ossPath+'?x-oss-process=image/resize,m_fixed,w_500',
            file: this.form.uploads[i].file
          }
          this.files.push(item)
        }
        for(var i=0;i<this.res.parts.length;i++){
          if(this.res.parts[i].partType=='3'){
            this.servicePriceAttr.push(this.res.parts[i]);
          }
        };
        if(this.res.finishOffer==true){
          this.offerStatus='1'
          this.optionsSurePrice=[
          {
            label:'是',
              value:'1',
          },
            {
              label:'否',
              value:'0',
              disabled: true
            },
          ]
        }else{
          this.offerStatus='0'
        }
        for(var i=0;i<res.data.object.allots.length;i++){
          if(res.data.object.allots[i].effectiveType==1){
            this.allotPeople.push(res.data.object.allots[i])
          }
        }
        var params = new URLSearchParams();
        params.append('storeId', this.res.allotShopId);
        this.$axios({
          method: 'post',
          url:'gp/declaration/getStoreMember',
          data:params
        }).then((res)=>{
        if(res.data.statusCode=200){
          this.storeAllMen=res.data.object;
          for(var i=0;i<this.allotPeople.length;i++){
            for(var j=0;j<res.data.object.length;j++){
              if(this.allotPeople[i].allotMemberId==res.data.object[j].id){
                this.$set(this.allotPeople[i], 'name', res.data.object[j].name);
                this.$set(this.allotPeople[i], 'shopKeeper', res.data.object[j].shopKeeper);
              }
            }
          }
          this.optionsPeopleNameZ=[];

          for(var i=0;i<res.data.object.length;i++){
            const item={
              label:res.data.object[i].name,
              value:res.data.object[i].id,
            }
            if(res.data.object[i].shopKeeper==1){
              this.optionsPeopleNameZ.push(item)
            }
          }

        }else{
          console.log(res.data.message)
        }
      })
        this.picCar=[];
        this.picRepair=[];
        for(var i=0;i<this.res.uploads.length;i++){
          if(this.res.uploads[i].fileType==0){
            const picItem = {src: 'https://rmcbapp.oss-cn-shenzhen.aliyuncs.com/'+this.res.uploads[i].ossPath+'?x-oss-process=image/resize,h_320',
            }
            this.picCar.push(picItem)
          }else if(this.res.uploads[i].fileType==1){
            const picItem = {src: 'https://rmcbapp.oss-cn-shenzhen.aliyuncs.com/'+this.res.uploads[i].ossPath+'?x-oss-process=image/resize,h_320',
            }
            this.picRepair.push(picItem)
          }

        }
          var regx = /(1[3|4|5|7|8][\d]{9}|0[\d]{2,3}-[\d]{7,8}|400[-]?[\d]{3}[-]?[\d]{4})/g;
          var regxZj = /0\d{2,3}\d{7,8}/;
          var str = this.res.remark;
          var strresult = matchPhoneNum(str,regx);
          this.res.remark=strresult;
          function matchPhoneNum(str,regx){
            var phoneNums1 = str.match(regx);
            var phoneNums2 = str.match(regxZj);
            if(phoneNums1==null){
              return str;
            }
            var phoneNums = phoneNums1.concat(phoneNums2);
            if(phoneNums==null){
              return str;
            }
//            if(phoneNums.length>1){
//              var newPhone='<a href="tel:'+phoneNums[1]+'">'+phoneNums[1]+'</a>';
//              str = str.replace(phoneNums[1],newPhone)
//              return str;
//            }else{
//              var newPhone='<a href="tel:'+phoneNums+'">'+phoneNums+'</a>';
//              str = str.replace(phoneNums,newPhone)
//              return str;
//            }
            for(var i=0;i<phoneNums.length;i++){
              console.log(phoneNums[i])
              var newPhone='<a href="tel:'+phoneNums[i]+'">'+phoneNums[i]+'</a>';
              str = str.replace(phoneNums[i],newPhone)
            }
            return str;
          };
      }else{
        Toast({
          message:res.data.message,
          position: 'middle',
          duration:800
        });
      }
    });
    },

    /** 查看图片 **/
    handleCheckPic(fileType){
      this.picList=[];
      for(var i=0;i<this.res.uploads.length;i++){

        if(this.res.uploads[i].fileType==fileType){
          const picItem = {src: 'https://rmcbapp.oss-cn-shenzhen.aliyuncs.com/'+this.res.uploads[i].ossPath+'?x-oss-process=image/resize,h_650',
          }
          this.picList.push(picItem)
        }
      }
      this.popupSwiper=true;
    },
    /** 打开建档弹窗事件 **/
    handleModify(type){
      this.popupMap=true
      return false;
      if(this.res.demandSource==1){
        this.form={
          entryFinish:0,
          id:this.res.id,
          remark:this.res.remark,
          demandType:this.res.demandType,
          demandSource:this.res.demandSource,
          applyShopName:this.res.applyShopName,
          linkMan:this.res.linkMan,
          linkPhone:this.res.linkPhone,
          carNo:this.res.carNo,
          selfNumber:this.res.selfNumber,
          carModel:this.res.carModel,
          address:this.res.address,
          allotShopId:this.res.allotShopId,
          allotShopName:this.res.allotShopName,
          allotStatus:this.res.allotStatus,
          parts:this.res.parts,
          comments:this.res.comments,
          sn:this.res.sn,
          cancelFlag:this.res.cancelFlag,
          totalAmt:this.res.totalAmt,
          needPay:this.res.needPay,
        };
      } else if(this.res.demandSource==3){
        this.form={
          entryFinish:0,
          id:this.res.id,
          remark:this.res.remark,
          demandType:this.res.demandType,
          demandSource:this.res.demandSource,
          applyShopName:this.res.applyShopName,
          insureNumber:this.res.insureNumber,
          linkMan:this.res.linkMan,
          linkPhone:this.res.linkPhone,
          carNo:this.res.carNo,
          selfNumber:this.res.selfNumber,
          carModel:this.res.carModel,
          address:this.res.address,
          insureDateStr:this.res.insureDateStr,
          totalAmt:this.res.totalAmt,
          allotShopId:this.res.allotShopId,
          allotShopName:this.res.allotShopName,
          allotStatus:this.res.allotStatus,
          parts:this.res.parts,
          applyCustomTypeName:this.res.applyCustomTypeName,
          applyCustomName:this.res.applyCustomName,
          sn:this.res.sn,
          cancelFlag:this.res.cancelFlag,
          needPay:this.res.needPay,
        };

        if(typeof this.res.checkOptions!=='undefined'){
          this.form.checkoptions=JSON.parse(this.res.checkOptions)
        }
      }else if(this.res.demandSource==4 || this.res.demandSource==5){
        this.form= {
          entryFinish: 0,
          id: this.res.id,
          remark: this.res.remark,
          demandType: this.res.demandType,
          demandSource: this.res.demandSource,
          applyShopName: this.res.applyShopName,
          carModel: this.res.carModel,
          address: this.res.address,
          totalAmt: this.res.totalAmt,
          allotShopId: this.res.allotShopId,
          allotShopName:this.res.allotShopName,
          carNo: this.res.carNo,
          selfNumber:this.res.selfNumber,
          allotStatus: this.res.allotStatus,
          parts:this.res.parts,
          applyCustomTypeName:this.res.applyCustomTypeName,
          applyCustomName:this.res.applyCustomName,
          sn:this.res.sn,
          cancelFlag:this.res.cancelFlag,
          needPay:this.res.needPay,
        }
        if(typeof this.res.checkOptions!=='undefined'){
          this.form.checkoptions=JSON.parse(this.res.checkOptions)
        }
      }
      if(this.form.needPay==true){
        this.form.needPay='1'
      }else if(this.form.needPay==false){
        this.form.needPay='0'
      }

      if(type=='typeSend'){
        this.selectPeopleNameZ=[];
        console.log(this.allotPeople)
        for(var i=0;i<this.allotPeople.length;i++){
          if(this.allotPeople[i].shopKeeper==1){
            this.selectPeopleNameZ.push(this.allotPeople[i].allotMemberId)
          }
        }
        this.popupSend=true;
      }else if(type=='typeModify'){
        this.popupModify=true;
      }else if(type=='typePrice'){
        this.popupPriceModify=true;
      }

  },
    /** 确认建档事件 **/
    handleConfirm(){
      if(this.res.demandSource!==1){
        this.form.parts=[];
        for(var i=0;i<this.form.checkoptions.length;i++){
          // 判断是否选择了位置
          if(this.form.checkoptions[i].isCheck==true){

            var indexAttr=this.form.checkoptions[i];
            if(indexAttr.label=='侧窗'){
              for(var h=0;h<indexAttr.side.length;h++){
                // 判断是否输入了左右两侧的玻璃
                if(indexAttr.side[h].number!==''){
                  //生成列表
                  const item={};
                  item.remark=indexAttr.label+indexAttr.side[h].label+'第'+indexAttr.side[h].number+'片';
                  item.partLocate=indexAttr.side[h].partLocate+indexAttr.side[h].number;
                  item.qty='1';
                  item.isChoose=1;
                  item.stock=false;
                  item.fromCustomer=false;
                  this.form.parts.push(item)
                }
              }
            }else{
              //生成列表
              const item={};
              item.remark=indexAttr.label;
              item.partLocate=indexAttr.partLocate;
              item.qty='1';
              item.isChoose=1;
              item.stock=false;
              item.fromCustomer=false;
              this.form.parts.push(item)
            }
          }
        }
      }

      var params = new URLSearchParams();
      params.append('demandSource',this.res.demandSource);
      params.append('demandId',this.res.id);
      params.append('demandData',JSON.stringify(this.form));
      this.$axios({
        method: 'post',
        url:'gp/declaration/sendDemand',
        data:params
      }).then((res)=>{
        if(res.data.statusCode==200){
        Toast({
          message:"修改成功",
          position: 'middle',
          duration: 1200
        });
        this.getData();
        this.popupModify = false;
      }else{
        Toast({
          message: res.data.message,
          position: 'middle',
          duration: 1500
        });
        this.popupModify = false;
      }
    });

    },
    /** 确认派工事件 **/
    handleSendConfirm(){

      if(this.form.allotShopName=='请选择委托门店'){
        Toast({
          message:"请选择委托门店",
          position: 'middle',
          duration: 1200
        });
        return false;
      }
      if(this.optionsPeopleNameZ.length<=0){
        Toast({
          message: '该门店没有用户，请重新选择服务门店',
          position: 'middle',
          duration:1000
        });
        return false;
      }
      if(this.selectPeopleNameZ.length<=0){
        Toast({
          message: '请选择门店管理员',
          position: 'middle',
          duration:1000
        });
        return false;
      }

      var params = new URLSearchParams();

      params.append('demandId', this.res.id);
      params.append('allotType', 0);
      params.append('sn', this.form.sn);
      params.append('allotShopId', this.form.allotShopId);
      params.append('allotShopName', this.form.allotShopName);
      params.append('demandData',JSON.stringify(this.form));
      this.$axios({
        method: 'post',
        url:'gp/declaration/demandAllot',
        data:params
      }).then((res)=>{
        if(res.data.statusCode==200){
        Toast({
          message:res.data.message,
          position: 'middle',
          duration: 1200
        });
        this.getData();
      }else{
        Toast({
          message: res.data.message,
          position: 'middle',
          duration: 1500
        });
      }
      this.popupSend = false;
    });
    },
    onValuesChange(picker, values) {
      if(this.popupShow==true){
        if(this.slots==this.applysSlots){
          this.form.allotShopName=values[0];

          let obj = {};
          obj = this.dealStoreList.find((item)=>{
              return item.storeName === values[0];
        });
          this.$set(this.form, 'allotShopId', obj.id);
          this.optionsPeopleNameZ=[];
          this.selectPeopleNameZ=[];
          var params = new URLSearchParams();
          params.append('storeId', this.form.allotShopId);
          params.append('currentPage','1');
          params.append('pageRow','100');
          this.$axios({
            method: 'post',
            url:'gp/declaration/getStoreMember',
            data:params
          }).then((res)=>{
          if(res.data.statusCode=200){
            this.showPeople=true;

            this.storeAllMen=res.data.object;
            for(var i=0;i<res.data.object.length;i++){
              const item={
                label:res.data.object[i].name,
                value:res.data.object[i].id,
              }
              if(res.data.object[i].shopKeeper==1){
                this.optionsPeopleNameZ.push(item);
                this.selectPeopleNameZ.push(item.value)
              }
            }

          }else{
            console.log(res.data.message)
          }
        })

        }else if(this.slots==this.allotsSlots){
          this.form.applyShopName=values[0];

        }
      }
    },
    handleSelectApply(val){

      if(val=='apply'){
        this.slots=this.applysSlots;
        if(this.form.allotShopName==undefined || this.form.allotShopName==''){
          this.form.allotShopName=this.slots[0].values[0];

          let obj = {};
          obj = this.dealStoreList.find((item)=>{
              return item.storeName === this.slots[0].values[0];
        });
          this.$set(this.form, 'allotShopId', obj.id);
          this.optionsPeopleNameZ=[];
          this.selectPeopleNameZ=[];
          var params = new URLSearchParams();
          params.append('storeId', this.form.allotShopId);
          params.append('currentPage','1');
          params.append('pageRow','100');
          this.$axios({
            method: 'post',
            url:'gp/declaration/getStoreMember',
            data:params
          }).then((res)=>{
            if(res.data.statusCode=200){
            this.showPeople=true;
            this.storeAllMen=res.data.object;
            for(var i=0;i<res.data.object.length;i++){
              const item={
                label:res.data.object[i].name,
                value:res.data.object[i].id,
              }
              if(res.data.object[i].shopKeeper==1){
                this.optionsPeopleNameZ.push(item)
                this.selectPeopleNameZ.push(item.value)
              }
            }

          }else{
            console.log(res.data.message)
          }
        })
        }
        for(var i=0;i<this.applysSlots[0].values.length;i++){
          if(this.applysSlots[0].values[i]==this.form.allotShopName){
            this.applysSlots[0].defaultIndex=i;
          }
        }

      }
      if(val=='allotFirst'){
        for(var i=0;i<this.allotsSlots[0].values.length;i++){
          if(this.allotsSlots[0].values[i]==this.form.applyShopName){
            this.allotsSlots[0].defaultIndex=i;
          }
        }
        this.slots=this.allotsSlots;
      }
      this.popupShow=true;
    },
    handleCancel(){
      this.popupSend = false;
      this.showPeople=false;
      this.getData();
    },

    /** 确认报价事件 **/
    handleConfirmPrice(){
      for(var i=0;i<this.form.parts.length;i++){
        console.log(this.form.parts[i].remark,this.form.parts[i].amount)
        if(this.form.parts[i].remark==''){
          Toast({
            message:"请输入描述",
            position: 'middle',
            duration: 1000
          });
          return false;
        }
      }

      if(this.offerStatus==1){
        if(this.form.totalAmt=='' || this.form.totalAmt==undefined){
          Toast({
            message:"总价不能为空",
            position: 'middle',
            duration: 1000
          });
          return false
        }
      }
      if(this.form.needPay==undefined){
        Toast({
          message:"请选择是否需要付款",
          position: 'error',
          duration: 1000
        });
        return false;
      }
      const modifyPrice={
        id:this.res.id,
        parts:this.form.parts,
        needPay:parseInt(this.form.needPay),
      }
      console.log(this.form.totalAmt,111)
      var params = new URLSearchParams();
      params.append('demandSource',this.res.demandSource);
      params.append('demandId',this.res.id);
      params.append('offerStatus',this.offerStatus);
      if(this.form.totalAmt!==undefined){
        params.append('totalOffer',this.form.totalAmt);
      }
      params.append('demandData',JSON.stringify(modifyPrice));
      this.$axios({
        method: 'post',
        url:'gp/declaration/offerDemand',
        data:params
      }).then((res)=>{
        if(res.data.statusCode==200){
        Toast({
          message:res.data.message,
          position: 'middle',
          duration: 1000
        });
        this.getData();
        this.popupPriceModify = false;
      }else{
        Toast({
          message: res.data.message,
          position: 'middle',
          duration: 1000
        });
        this.popupPriceModify = false;
      }
    });
    },

    /** 强制撤回 **/
    handleRecall(){

      MessageBox({
        title: '',
        message: '确认是否撤回工单?',
        showCancelButton: true
      }).then(action => {
        if(action=='confirm'){
        /**确认是否撤回订单*/
        var params = new URLSearchParams();
        params.append('demandId',this.res.id);
        this.$axios({
          method: 'post',
          url:'gp/declaration/demandCancel',
          data:params
        }).then((res)=>{
          if(res.data.statusCode==200){
          Toast({
            message:res.data.message,
            position: 'middle',
            duration: 1000
          });
          this.getData();
        }else{
          Toast({
            message: res.data.message,
            position: 'middle',
            duration: 1000
          });
        }
      });
      }
    });
    },
    /** 取消 **/
    handleCancelOrder(){

      MessageBox({
        title: '',
        message: '确认是否取消工单?',
        confirmButtonText:'是',
        cancelButtonText:'否',
        showCancelButton: true
      }).then(action => {
        if(action=='confirm'){
        /**确认是否取消订单*/
        var params = new URLSearchParams();
        params.append('demandId',this.res.id);
        this.$axios({
          method: 'post',
          url:'gp/declaration/demandVoid',
          data:params
        }).then((res)=>{
          if(res.data.statusCode==200){

          Toast({
            message:res.data.message,
            position: 'middle',
            duration: 1000
          });
          this.getData();
        }else{
          Toast({
            message: res.data.message,
            position: 'middle',
            duration: 1000
          });
        }
      });
      }
    });
    },

    handleAddPrice(partType){
      /**生成列表**/
      const item={};
      item.type=1;
      item.brand='';
      item.remark='';
      item.amount='';
      item.partType=partType;
      item.partLocate='';
      item.qty='1';
      item.fromCustomer=false;
      this.form.parts.push(item)
      if(partType=='3'){
        this.servicePriceAttr.push(item);
      }
    },
    handleDelPrice(item,index){
      this.form.parts.splice(index, 1);
      if(item.partType=='3'){
        this.servicePriceAttr.splice(0, 1);
      }
    },
    handleClosePrice(){
      this.getData();
      this.popupPriceModify=false;
    },
    handleSelectAddress(){
      this.popupMap=true;
      this.isSelectMap=true;
    },
    handleMapClose(){
      this.popupMap=false;
    },
    getMapData(data){
      console.log(data)
      this.form.address=data.address;
      this.form.xAxis=data.xAxis;
      this.form.yAxis=data.yAxis;
    },
    handleNavigation(){
      this.$wx.ready(()=>{
      this.$wx.openLocation({
          latitude: parseFloat(this.res.yAxis), // 纬度，浮点数，范围为90 ~ -90
          longitude: parseFloat(this.res.xAxis), // 经度，浮点数，范围为180 ~ -180。
          name: '', // 位置名
          address: this.res.address, // 地址详情说明
          scale: 16, // 地图缩放级别,整形值,范围从1~28。默认为16
          success: (res)=> {},
        error: function(res) {
        if (res.errMsg.indexOf('function_not_exist') > 0) {
          alert('版本过低请升级')
        }
      }
    });
    })
    },
    handleRecognition(){
      var params = new URLSearchParams();
      params.append('data',this.form.remark);
      this.$axios({
        method: 'post',
        url:'gp/declaration/recognitionText',
        data:params
      }).then((res)=>{
        if(res.data.statusCode==200){

        this.form.carNo=res.data.object.carNo;
        this.form.carModel=res.data.object.model;
        this.form.linkPhone=res.data.object.mobile;
        this.form.linkMan=res.data.object.cusName;
        console.log(res)
      }else{
        Toast({
          message: res.data.message,
          position: 'middle',
          duration: 1000
        });
      }
    });

    },

    handleSureApplyCancle(){
      MessageBox({
        title: '',
        message: '确认取消后您希望？',
        confirmButtonText:'重新派单',
        cancelButtonText:'直接取消',
        showCancelButton: true
      }).then(action => {
        if(action=='confirm'){

//        重新派单
        var params = new URLSearchParams();
        params.append('demandId',this.res.id);
        params.append('cancelFlag',3);
        this.$axios({
          method: 'post',
          url:'gp/declaration/demandCancelApply',
          data:params
        }).then((res)=>{
          console.log(res)
        if(res.data.statusCode==200){
          Toast({
            message: res.data.message,
            position: 'middle',
            duration:800
          });
          this.getData();
        }else{
          Toast({
            message: res.data.message,
            position: 'middle',
            duration:800
          });
        }
      });
      }else if(action=='cancel'){

        /**确认是否取消订单*/
        var params = new URLSearchParams();
        params.append('demandId',this.res.id);
        params.append('cancelFlag',2);
        this.$axios({
          method: 'post',
          url:'gp/declaration/demandCancelApply',
          data:params
        }).then((res)=>{
          console.log(res)
        if(res.data.statusCode==200){

          this.getData();
          Toast({
            message: res.data.message,
            position: 'middle',
            duration:800
          });
        }else{
          Toast({
            message: res.data.message,
            position: 'middle',
            duration:800
          });
        }
      });
      }
    });
    },
    handleNoApplyCancle(){
      MessageBox({
        title: '',
        message: '是否驳回取消申请？',
        confirmButtonText:'是',
        cancelButtonText:'否',
        showCancelButton: true
      }).then(action => {
        if(action=='confirm'){

//        驳回申请
        var params = new URLSearchParams();
        params.append('demandId',this.res.id);
        params.append('cancelFlag',4);
        this.$axios({
          method: 'post',
          url:'gp/declaration/demandCancelApply',
          data:params
        }).then((res)=>{
          console.log(res)
        if(res.data.statusCode==200){
          Toast({
            message: res.data.message,
            position: 'middle',
            duration:800
          });
          this.getData();
        }else{
          Toast({
            message: res.data.message,
            position: 'middle',
            duration:800
          });
        }
      });
      }
    });
    }
  }
}
</script>

<style>
  body{
    position: relative;
  }
  .select-people-name .mint-cell .mint-cell-wrapper{
    background:none;
    padding: 0;
  }
  .select-people-name .mint-checklist-label{
    padding: 0;
  }

  .module-action-log .module-table{
    width: 100%;
    padding:24px;
    border-collapse:collapse !important;
  }
  .module-action-log  .action-item{
    padding:5px 4px;
    vertical-align: top;
  }
  .module-action-log .action-list-header .action-item{
    padding:5px 4px 10px;
    border-bottom:1px solid #ddd;
  }
  .platform-report-details .info-service .mint-field-core{
    height: 100px;
  }
  .platform-report-details .info-service-qixiu .mint-field-core{
    height: 100px;
    min-height: 100px;
  }
  .mint-toast{
    z-index:100000
  }
  .module-position{
    padding:0 10px 10px;
  }
  .module-position .position-list{
    display: inline-block;
    vertical-align: top;
    width: 70%;
  }
  .module-position .label-title{
    display: inline-block;
    vertical-align: top;
    width: 96px !important;
    font-size: 16px;
  }
  .platform-report-details .label-brand{
    background: #ccc;
    padding:6px 12px;
    color:#fff;
    font-size: 14px;
    border-radius:6px
  }
  .platform-report-details  .check-position{
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    margin-right:10px;
  }
  .platform-report-details .position-item{
    display:inline-block;
    vertical-align: middle;
    width:32%;
    padding:0 10px 6px 0;
    list-style:none;
    font-size: 15px;
  }
  .platform-report-details .position-item:last-child{
    width: 100%;
  }
  .platform-report-details .input-text{
    position: relative;
    top: -2px;
    margin:0 6px;
    width:32px;
    padding:5px 8px;
    font-size:16px;
    border: 1px solid #ccc;
    outline: none;
    color: #333;
    text-align: center;
    border-radius: 4px;
  }
  .platform-report-details .item-block{
    display: inline-block;
    vertical-align: middle;
    padding-right:6px;
    margin: 0;
  }
  .platform-report-details .type-item{
    display: inline-block;
    margin: 0 16px 0 0;
  }
  .platform-report-details .type-item .check-position{
    display: none;
  }
  .platform-report-details .type-item .check-position:checked ~.label-brand{
    background:#c34853;
  }

  .platform-report-details .type-item-details{
    display: none;
    margin: 0;
    padding:10px 0 0 0;
    font-size: 14px;
  }
  .check-position:checked ~.type-item-details{
    display: block;
  }

  .pic-none.pic-none-car{
    background: #fff;
    height:120px;
    line-height:120px;
    margin:0 0 12px;
  }
  .pic-none{
    height:360px;
    line-height:360px;
    font-size: 18px;
    color: #999;
    text-align: center;
  }
  .report-order-details .pic-car{
    background: #fff;
    text-align: center;
  }
 .report-order-details .pic-car.mint-swipe{
    height:220px;
  }
 .report-order-details .pic-car.mint-swipe img{
    height:100%;
  }
  .me-popup-pic .mint-swipe{
    background: #000;
    text-align: center;
  }
  /*.platform-report-details .mint-swipe img{*/
    /*width: 100%;*/
  /*}*/
  /*.mint-swipe img{*/
    /*height: 100%;*/
  /*}*/
  .me-popup{
    width: 100%;
  }
  .report-order-details .me-popup-pic{
    width: 100%;
    height:100%;
  }
  .me-popup-pic .mint-swipe,.me-popup-pic .mint-swipe-items-wrap{
    height: 100% !important;
  }
  .platform-report-details .icon-close-pic{
    background: #c34853;
    position: absolute;
    top:-24px;
    right:6px;
    z-index:2000;
    width: 48px;
    height: 48px;
    border-radius:50%;
    font-size: 24px;
    color:#fff;
    text-align: center;
    line-height: 48px;
  }
  .swiper-pic .item-content{
    position: absolute;
    left: 0;
    right: 0;
    top:0;
    bottom:40px;
    /*padding:0 0 32px;*/
    /*transform: translate(0,-50%);*/
  }
  .swiper-pic .item-title{
    background:rgba(0,0,0,0.6);
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding:12px 0;
    font-size: 16px;
    color: #fff;
  }
  .swiper-pic img{
    position: absolute;
    top: 50%;
    display: block;
    transform: translate(0,-50%);
    max-width: 100%;
    max-height:100%;
  }
  .swiper-pic .mint-swipe-indicators{
    display: none;
  }
  .platform-report-details .picker-item{
    color:#999
  }
  .platform-report-details .picker-item.picker-selected{
    color:#c34853
  }
  .platform-report-details .popupResult,.platform-report-details .popup-price{
    width: 100%;
    height:90%;
    overflow: auto;
    padding:24px 0 0;
  }
  .platform-report-details .popupResult .mint-cell-wrapper,.platform-report-details .popup-price .mint-cell-wrapper{
    background:none;
  }

  .platform-report-details .popupResult .mint-cell{
    background:none;
    margin:0 0 14px;
    min-height:inherit
  }
  .platform-report-details .popupResult .mint-cell-value{
    min-height:36px;
    padding:4px 8px;
    border:1px solid #ddd;
    border-radius:6px
  }
  .platform-report-details .popupResult .item-select{
    padding:0;
  }
  .platform-report-details .popupResult .item-select .mint-cell-value{
    margin-right:0;
    padding:12px 6px;
    flex:1;
  }
  .platform-report-details .popupResult .item-select .mint-cell-title{
    flex:none;
  }
  .mint-checklist-title{
    margin: 0;
  }
  .report-order-details{
    padding:0 0 16px;
  }
  .report-order-details .action-buy{
    background-color:#c34853;
    position: absolute;
    top: 0;
    right:24px;
    height: 32px;
    font-size: 15px;
  }
  .report-order-details .mint-checkbox-core{
    border-radius:3px
  }
  .report-order-details .mint-cell{
    min-height:46px;
  }
  .report-order-details .mint-checklist{
    background: #fff;
  }
  .report-order-details .mint-checkbox-input:checked+.mint-checkbox-core{
    background-color: #c34853;
    border-color: #c34853;
  }
  .report-order-details .mint-checkbox-label{
    font-size: 14px;
    color:#666;
  }
  .report-order-details .product-content{
    background: #fff;
    margin:0 0 12px;
    padding: 12px;
    font-size:14px;
  }
  .report-order-details .product-content .product-img{
    display: table-cell;
    vertical-align: top;
    width:42%;
    padding-right: 12px
  }
  .report-order-details .product-content .product-details{
    display: table-cell;
    vertical-align: top;
    width:50%;
  }
  .report-order-details .product-content .item{
    margin:0 0 4px;
  }
  .report-order-details .product-content .item-img{
    margin:0 0 10px;
  }

  .report-order-details .module-block{
    margin:0 0 12px;
  }
  .report-order-details .module-block-first{
    padding:12px 0 0;
  }
  .report-order-details .word-content{
    background: #fff;
    padding:10px 12px;
    font-size: 16px;
    color:#000;
    margin: 0;
    line-height: 24px;
    border-top:1px solid #f5f5f5;
  }
  .report-order-details .word-content span{
    color:#999;
  }
  .report-order-details .word-info{
    font-size: 16px;
    line-height:26px;
  }
  .report-order-details .word-price{
    line-height: 26px;
  }
  .report-order-details .price-add{
    padding: 6px 0;
  }
  .report-order-details .price-add .input-price{
    width: 46px;
    margin-left: 2px;
    padding:6px;
    border: 1px solid #ddd;
    outline: none;
    border-radius: 3px;
    color:#c34853;
    text-align: right;
  }

  .report-order-details .button-content{
    padding:16px 16px ;
    font-size:0;
    text-align: center;
  }
  .report-order-details .button-content .mint-button{
       display: inline-block !important;
       width: 100%;
       font-size: 18px;
     }
  .report-order-details .button-block-6{
    display: inline-block;
    width: 50%;
    padding:0 8px;
  }
  .report-order-details .button-content .mint-button--default{

    background-color:#fff;
  }
  .platform-report-details .deal-tips{
    padding:2px 12px;
    font-size: 15px;
    color:#666;
  }
  .report-order-details .block-header{
    background-color:#f5f5f5;
    position: relative;
    display: block;
    padding:2px 12px 10px;
    font-size:15px;
    color: #666;
  }
  .report-order-details .item-state{
    padding-right: 10px;
    float: right;
    font-weight: bold;
  }
  .report-order-details .block-header:before{
    background:#c34853;
    position: relative;
    top:-2px;
    display:inline-block;
    vertical-align: middle;
    width:3px;
    height:16px;
    content: '';
    margin-right:5px;
  }
  .report-order-details .block-header.block-header-no-before:before{
    background:none;
    width:0;
    margin: 0;
  }
  .report-order-details .block-header .icon-jingshi{
    position: relative;
    top: 1px;
    color:#ffd101;
    font-size:20px;
    margin-right:3px;
  }
  .module-date{
    padding:0 12px;
    margin:6px 0 8px;
    font-size: 15px;
    color:#c34853;
  }


  .platform-report-details .people-list{
    border-top:1px solid #ddd;
    padding:10px 20px 0 12px;
    margin: 0;
  }
  .platform-report-details .people-item{
    margin: 0 0 16px;
    border-bottom:1px solid #ddd;
  }
  .platform-report-details .people-item .item-title{
    display: block;
    font-size: 16px;
    line-height: 36px;
  }
  .platform-report-details .select-people-name .mint-cell{
    background:none;
    display:inline-block;
    width:32%;
  }
  .platform-report-details .select-people-name .mint-cell .mint-cell-value{
    border:none;
    padding: 0;
  }
  .platform-report-details .popup-price .select-sure-price .mint-cell-value{
    padding:0;
    border:none !important;
  }
  .platform-report-details .popup-price .mint-radiolist-label{
    display: flex;
  }

  .platform-report-details .module-sure-price{
    padding:0 14px;
  }
  .platform-report-details .module-sure-price .addon{
    display: inline-block;
    font-size:15px;
    vertical-align: middle;
  }
  .platform-report-details .select-sure-price{
    display: inline-block;
    vertical-align: middle;
  }
  .platform-report-details .module-sure-price .select-sure-price .mint-cell{
    display: inline-block;
    width: 44%;
    margin: 0;
  }
  .platform-report-details .module-sure-price .select-sure-price .mint-radiolist-title{
    margin: 0;
  }
  .platform-report-details .module-sure-price .price-tips{
    padding:6px 0 10px 100px;

    color:#ef4f4f;
    font-size: 13px;
  }
  .platform-report-details .sure-price-tips{
    padding:6px 0 0 10px;
    color:#ef4f4f;
    font-size: 14px;
    text-align: center;
  }
  .platform-report-details .icon-didian1{
    display: inline-block;
    width: 32px;
    font-size:22px;
    color:#ef4f4f;
    text-align: center;
  }
  .platform-report-details .word-content .icon-didian1{
    position: absolute;
    top: 0;
    right: 0;
    padding:0 2px;
    font-size: 22px;
    color:#c34853 !important;
  }
  .platform-report-details .word-content-address{
    display: inline-block;
    vertical-align: top;
    width: 74%;
    position: relative;
    padding-right:40px;
  }
  .platform-report-details .add-button{
    padding:0 16px 16px;
    text-align: right;
  }

  .platform-report-details .add-button .mint-button--normal{
    font-size: 15px;
    margin:0 4px;
  }
  .platform-report-details .add-button .mint-button--normal .iconfont{
    margin-right:6px;
  }
  .platform-report-details .popupResult .mint-cell-title{
    width: 96px !important;
  }
  .platform-report-details .popup-price .mint-cell-title{
    width:60% !important;
  }
  .platform-report-details .popup-price .mint-cell:last-child{
    background:none;
  }
  .platform-report-details .popup-price .mint-cell-value{
    min-height:36px;
    padding:4px 8px;
    border:1px solid #ddd;
    border-radius:6px
  }
  .platform-report-details .price-item{
    position: relative;
    padding:0 6px;
  }
  .platform-report-details .price-item,.platform-report-details .price-header{
    display: flex;
    margin: 0 0 10px;
  }
  .platform-report-details .price-header{
    padding:0 6px 4px;
    font-size: 16px;
  }
  .platform-report-details .price-list .item-addon{
    display:flex;
    width: 60% !important;
  }
  .platform-report-details .price-list .item-content{
    display:flex;
    width:40%;
  }
  .platform-report-details .price-header .item-addon,.platform-report-details .price-header .item-content{
    padding:0 10px;
  }
  .platform-report-details .price-list .icon-delete{
    background: #c34853;
    position: absolute;
    top:-8px;
    right:8px;
    width: 24px;
    height: 24px;
    border-radius:50%;
    color:#fff;
    text-align: center;
    line-height:30px;
  }
  .platform-report-details .icon-delete:before{
    position: relative;
    top: -4px;
    content:'-';
    font-size: 28px;
  }
  .platform-report-details .popup-price .price-num .mint-cell-title{
    margin:0 5px;
  }
  .platform-report-details .module-action-log .word-content{
    padding:10px;
  }
  .platform-report-details .module-action-log .word-auto{
    padding:2px 0 0;
    position: relative;
    max-height:220px;
    overflow: auto;
  }
  .platform-report-details .module-block-price .text-price{
    float: right;
  }

  /*.platform-report-details .img-upload-content{*/
    /*padding:14px 12px 0;*/
    /*margin: 0;*/
  /*}*/
  /*.platform-report-details .img-upload-content .item{*/
    /*position: relative;*/
    /*width:30%;*/
    /*float: left;*/
    /*height:60px;*/
    /*padding:0 12px 0 0;*/
    /*margin:0 0 20px;*/
  /*}*/
  /*.platform-report-details .img-upload-content img{*/
    /*width: 100%;*/
    /*height:60px;*/
  /*}*/
  /*.platform-report-details .img-upload-content .icon-shanchu{*/
    /*background: #c34853;*/
    /*position: absolute;*/
    /*top:-12px;*/
    /*right:2px;*/
    /*width: 24px;*/
    /*height: 24px;*/
    /*border-radius:50%;*/
    /*font-size: 20px;*/
    /*color:#fff;*/
    /*text-align: center;*/
    /*line-height: 28px;*/
  /*}*/

  /*.platform-report-details .img-upload-content .item-add{*/
    /*border:1px dashed #ddd;*/
  /*}*/
  /*.platform-report-details .img-upload-content .item-add .icon-jiahao{*/
    /*display: block;*/
    /*height: 60px;*/
    /*font-size: 50px;*/
    /*color: #ddd;*/
    /*text-align: center;*/
    /*border:1px dashed #ddd;*/
  /*}*/
  .platform-report-details .input-upload {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 4;
    opacity: 0;
    font-size: 0;
    width: 100%;
  }
  .platform-report-details .button-content .del-button{
    padding:10px 0 0;
    text-align: right;
  }
  .platform-report-details .button-content .icon-shanchu{
    font-size:28px;
  }
  .popup-map{
    width: 100%;
    height: 100%;
  }
  .action-navigation{
    margin-left: 4px;
    font-size: 14px;
    height:32px;
  }
  .module-recognition{
    padding:0 12px 16px;
    text-align: right;
  }
  .module-recognition .action-recognition{
    height: 36px;
    font-size: 14px;
  }
  .report-order-details .module-height{
    height: 12px;
  }
  /*.add-img{*/
    /*display: block;*/
    /*width: 100%;*/
    /*height:60px;*/
    /*padding:6px 0 0;*/
    /*text-align: center;*/
    /*color: #888;*/
    /*font-size:14px;*/
  /*}*/
  /*.add-img:before{*/
    /*display: block;*/
    /*margin:0 auto 4px;*/
    /*font-size:20px;*/
  /*}*/
</style>
